/**
 * 初始化地球模型
 * 后期可在这更改地球模型
 */
import { UnwrapRef } from 'vue';

export const initMap = (viewerContainer: UnwrapRef<HTMLDivElement | null>) => {
    const viewer = new Cesium.Viewer(viewerContainer!, {
        // 地形影像
        // terrain: Terrain.fromWorldTerrain(),

        //geocoder: false, // 是否创建右上角的查询按钮（右上第一个）
        //     homeButton: false, // 是否创建 home 按钮（右上第二个）
        //     sceneModePicker: false, // 是否创建右上角的切换地图的按钮（右上第三个）
        //     baseLayerPicker: false, // 是否创建右上角 BaseLayerPicker 小部件（右上第四个）
        //     navigationHelpButton: false, // 是否创建右上角的导航帮助按钮（右上第五个
        //     // vrButton: true, // 是否创建右下角的 VR 按钮，默认值为 true
        //     animation: false, // 是否创建左下角的动画小部件
        //     fullscreenButton: false, // 是否创建右下角全屏按钮
        //     timeline: false, // 是否创建最下方的时间线
        //     infoBox: false, // 点击实体是否展示详情
        //     selectionIndicator: false, // 点击实体是否显示选中样式

        baseLayerPicker: false, // 是否创建右上角 BaseLayerPicker 小部件（右上第四个）
        geocoder: false, // 是否创建右上角的查询按钮（右上第一个）
        homeButton: false, // 是否创建 home 按钮（右上第二个）
        sceneModePicker: false, // 是否创建右上角的切换地图的按钮（右上第三个）
        navigationHelpButton: false, // 是否创建右上角的导航帮助按钮（右上第五个）
        vrButton: true, // 是否创建右下角的 VR 按钮，默认值为 true
        animation: false, // 是否创建左下角的动画小部件
        fullscreenButton: false, // 是否创建右下角全屏按钮
        timeline: false, // 是否创建最下方的时间线
        infoBox: false, // 点击实体是否展示详情
        navigation: false,
        scene3DOnly: true,
        // selectionIndicator: true, // 点击实体是否显示选中样式
        // //三维视图模式，枚举值3
        // sceneMode: Cesium.SceneMode.SCENE3D,
        contextOptions: {
            webgl: { alpha: true }
        }
        // contextOptions: {
        //     webgl: {
        //         alpha: true,
        //         depth: true,
        //         stencil: true,
        //         antialias: true,
        //         premultipliedAlpha: true,
        //         preserveDrawingBuffer: true,
        //         failIfMajorPerformanceCaveat: true
        //     }
        // }
    });
    // console.log('--viewers--', viewer);
    // viewer.scene.globe.baseColor = Cesium.Color.IVORY;
    viewer._cesiumWidget._creditContainer.style.display = 'none';
    //将 viewer渲染分辨率比例设置为设备的物理像素与 CSS 像素的比例 ，渲染的图像能够以更高的像素密度显示，从而避免图像模糊或锯齿。
    // viewer.resolutionScale = window.devicePixelRatio;
    disableSawtooth(viewer);
    const scene = viewer.scene;
    viewer.clock.currentTime = Cesium.JulianDate.fromDate(new Date(2023, 4, 15, 11)); // 设定比当前时间更好的光照效果
    //帧率显示
    scene.debugShowFramesPerSecond = false;
    scene.shadowMap.darkness = 1.275; //设置第二重烘焙纹理的效果（明暗程度）
    //设置太阳光的颜色与强度
    scene.lightSource.sunLightColor = new Cesium.Color(1 * 2, 1 * 2, 1 * 2, 1);
    scene.sun.show = true;
    // viewer.terrainProvider = new Cesium.SuperMapTerrainProvider({
    //   url: URL_CONFIG.SiChuan_TERRAIN,
    //   isSct: true,
    //   invisibility: true
    // })

    viewer.imageryLayers.addImageryProvider(
        new Cesium.BingMapsImageryProvider({
            url: 'https://dev.virtualearth.net',
            mapStyle: Cesium.BingMapsStyle.AERIAL,
            key: 'AraGkBfghounWbX8rAcEEL8VXISh5M7tbxnlGxKocM134GmIr-yr48WBJvfaRaCg' //当场景出现黑球时可至官网（https://www.bingmapsportal.com/）申请key
        })
    );

    // viewer.scene.camera.setView({
    //     destination: new Cesium.Cartesian3.fromDegrees(121.1571944, 31.2207278, 0),
    //     orientation: {
    //         heading: 6.116051,
    //         pitch: -0.275007,
    //         roll: 6.283185
    //     }
    // });

    // viewer.imageryLayers.addImageryProvider(
    //   new Cesium.SuperMapImageryProvider({
    //     //经纬度投影地图TILE IMGERY（中国区域）
    //     url : 'http://www.supermapol.com/realspace/services/map-World/rest/maps/World_Google' //经纬度地图服务
    //   })
    // );

    // const promise = scene.open('http://www.supermapol.com/realspace/services/3D-OlympicGreen/rest/realspace');
    (window as any).__viewer = viewer;
    return viewer;
};

// 设置自定义天空盒
export const createOutSkyBox = (viewer, show) => {
    // 外天空盒
    viewer.scene.skyBox = new Cesium.SkyBox({
        sources: {
            positiveX: '/images/skybox1/tycho2t3_80_px.jpg',
            negativeX: '/images/skybox1/tycho2t3_80_mx.jpg',
            positiveY: '/images/skybox1/tycho2t3_80_py.jpg',
            negativeY: '/images/skybox1/tycho2t3_80_my.jpg',
            positiveZ: '/images/skybox1/tycho2t3_80_pz.jpg',
            negativeZ: '/images/skybox1/tycho2t3_80_mz.jpg'
        },
        show: show
    });
};

/**
 * 开启抗锯齿
 */
export const disableSawtooth = (viewer) => {
    // 是否支持图像渲染像素化处理
    if (Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
        viewer.resolutionScale = window.devicePixelRatio;
    }
    // 开启抗锯齿
    viewer.scene.postProcessStages.fxaa.enabled = true;
};

export interface CameraInfo {
    longitude: string;
    latitude: string;
    height: string;
    heading: string;
    pitch: string;
    roll: string;
    cartesian3Position?: any;
}

let lastUpdate = 0;

/**
 * 启动相机信息监听器 获取相机位置，姿态等
 * @param viewer Cesium Viewer 实例
 * @param onUpdate 回调函数（每次更新时调用）
 * 新增了限流功能
 */
export function startCameraInfoTracking(viewer, onUpdate: (info: CameraInfo) => void) {
    viewer.scene.postRender.addEventListener(() => {
        const now = Date.now();
        if (now - lastUpdate < 100) return; // 每 100ms 更新一次
        lastUpdate = now;
        // 获取位置 wgs84的地心坐标系，x,y坐标值以弧度来表示
        const position = viewer.scene.camera.positionCartographic; //with longitude and latitude expressed in radians and height in meters.
        const cameraInfo: CameraInfo = {
            // 弧度转经纬度
            longitude: Cesium.Math.toDegrees(position.longitude).toFixed(6),
            latitude: Cesium.Math.toDegrees(position.latitude).toFixed(6),
            height: position.height,
            // 获取 相机姿态信息
            heading: Cesium.Math.toDegrees(viewer.camera.heading),
            pitch: Cesium.Math.toDegrees(viewer.camera.pitch),
            roll: Cesium.Math.toDegrees(viewer.camera.roll),
            cartesian3Position: viewer.scene.camera.position
        };
        onUpdate(cameraInfo);
    });
}

/**
 * 弃用
 * @param viewer
 */

export const getCameraInfo = (viewer) => {
    viewer.scene.postRender.addEventListener(() => {
        // 获取 相机姿态信息
        const head = viewer.scene.camera.heading;
        const pitch = viewer.scene.camera.pitch;
        const roll = viewer.scene.camera.roll;
        const info = { head: head, pitch: pitch, roll: roll };
        // 获取位置 wgs84的地心坐标系，x,y坐标值以弧度来表示
        const position = viewer.scene.camera.positionCartographic; //with longitude and latitude expressed in radians and height in meters.
        // 弧度转经纬度
        const longitude = Cesium.Math.toDegrees(position.longitude).toFixed(6);
        const latitude = Cesium.Math.toDegrees(position.latitude).toFixed(6);
        const height = position.height;
        return {
            lng: longitude,
            lat: latitude,
            h: height,
            mat: info,
            cartesian3Position: viewer.scene.camera.position
        };
    });
};

/**
 * 点击鼠标左键获取点位信息
 * @param {*} viewer
 */

export const getMousePosition = (viewer, callback) => {
    //首先移除之前添加的点
    viewer.entities.removeAll();
    // 创建ScreenSpaceEventHandler实例
    const handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
    // 监听鼠标左键点击事件
    handler.setInputAction((click) => {
        // 获取点击位置的笛卡尔坐标
        const cartesian = viewer.camera.pickEllipsoid(click.position, viewer.scene.globe.ellipsoid);
        if (cartesian || Cesium.defined(cartesian)) {
            //将笛卡尔坐标转换为地理坐标
            const cartographic = Cesium.Cartographic.fromCartesian(cartesian);
            // 计算经纬度坐标
            const longitude = Cesium.Math.toDegrees(cartographic.longitude).toFixed(6);
            const latitude = Cesium.Math.toDegrees(cartographic.latitude).toFixed(6);
            const height = cartographic.height;
            // 显示点击点的经纬度坐标
            // console.log(`经度: ${longitude}, 纬度: ${latitude}, 高度: ${height}`);
            // 显示点击点的笛卡尔坐标
            // console.log('点击点的笛卡尔坐标：', cartesian);
            // 显示点位信息
            // alert(`您点击的位置是：\n经度: ${longitude}, 纬度: ${latitude}, 高度: ${height}`);
            //在点击位置添加对应点
            // viewer.entities.add(
            //   new Cesium.Entity({
            //     point: new Cesium.PointGraphics({
            //       color: new Cesium.Color(1, 1, 0),
            //       pixelSize: 10,
            //       outlineColor: new Cesium.Color(0, 1, 1)
            //     }),
            //     position: Cesium.Cartesian3.fromDegrees(longitude, latitude, height + 0.5)
            //   })
            // );
            callback({ longitude, latitude, height });
        }
    }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
};
